import { Howl } from 'howler';
import type { TimelineEngine } from '@xzdarcy/react-timeline-editor';

class AudioControl {
  cacheMap= new Map();
  muteing = false;
  listenerMap= {};
  playingId = null;
  constructor(){
    
  }
  
  start(data: { id: string; engine: TimelineEngine; src: string; startTime: number; time: number,onPlay:any }) {
    const { id, src, startTime, time, engine } = data;
    let item: Howl;
    this.playingId = id+''
    if (this.cacheMap[id]) {
      item = this.cacheMap[id];
      item.rate(engine.getPlayRate());
      item.seek((time - startTime) % item.duration());
      item.play();
      if( data.onPlay){
        data.onPlay();
      }
    } else {
      item = new Howl({ src, loop: false, autoplay: true ,format: 'wav',mute:this.muteing});

      this.cacheMap[id] = item;
      item.on('load', () => {
        item.rate(engine.getPlayRate());
        item.seek((time - startTime) % item.duration());
        if( data.onPlay){
          data.onPlay();
        }
      });
    }
    // item.on('load', () => {
    //   if( data.onPlay){
    //     data.onPlay();
    //   }
    // });
    
    

    // const timeListener = (data: { time: number }) => {
    //   const { time } = data;
    //   item.seek(time);
    // };
    // const rateListener = (data: { rate: number }) => {
    //     const { rate } = data;
    //     item.rate(rate);
    //   };
      if (!this.listenerMap[id]) this.listenerMap[id] = {};
      // engine.on('afterSetTime', timeListener);
      // engine.on('afterSetPlayRate', rateListener);
      // this.listenerMap[id].time = timeListener;
      // this.listenerMap[id].rate = rateListener;
    }
    preload(src,callback){
      let item: Howl;
      let url = src
      item = new Howl({ url, preload:true, loop: false, autoplay: true ,format: 'wav'});
      this.cacheMap[src] = item;
      item.on('load', () => {
        callback()
      });
    }
    stop() {
       
        console.log(this.cacheMap)
      
        for (let key in this.cacheMap) {
          if (this.cacheMap.hasOwnProperty(key)) {
              const item = this.cacheMap[ key];
              item.stop();

              if (this.listenerMap[ key]) {
                delete this.listenerMap[ key];
              }
          }
        }
        // if (this.cacheMap[ this.playingId]) {
        //   const item = this.cacheMap[ this.playingId];
        //   item.stop();
          
        //   if (this.listenerMap[ this.playingId]) {
        //     // this.listenerMap[ this.playingId].time && engine.off('afterSetTime', this.listenerMap[ this.playingId].time);
        //     // this.listenerMap[ this.playingId].rate && engine.off('afterSetPlayRate', this.listenerMap[ this.playingId].rate);
        //     delete this.listenerMap[ this.playingId];
        //   }
        // }
        this.playingId = null
    }
    mute(){
      this.muteing = true
      console.log(this.cacheMap)
      
      for (let key in this.cacheMap) {
        if (this.cacheMap.hasOwnProperty(key)) {
            const item = this.cacheMap[ key];
            item.mute(true);
        }
      }
    }
    unmute(){
      console.log(this.cacheMap)
      this.muteing = false
      for (let key in this.cacheMap) {
        if (this.cacheMap.hasOwnProperty(key)) {
            const item = this.cacheMap[ key];
            item.mute(false);
        }
      }
    }
}

export default AudioControl;